<template>
<div class="tasks">
   <v-nav :path="path" :title="title">

   
   </v-nav>
   <div class="bar bar-header-secondary">
  <button class="button button-success pull-right" @click="createClub()">创建俱乐部</button>
</div>  

  <div style="height:50px"></div>
  <div type="tab" class-name="tasks-tabs">
    <!-- <v-tab name="all-tasks" title="所有任务" status="active" -->
    <!-- distance="55" v-pull-to-refresh="refreshAll"> -->
      <!-- <v-layer></v-layer> -->
    <div class="content club" >
       <div id = "list" v-for="club in clubList"  >
        <div class="card" v-if="club.status==0"cr>
            
            <div class="card-content" @click="operateSelect(club.id,club.audit_count,club.current,club.club_name,club.gems)">
                <div class="card-content-inner">
                  
                    <ul>
                        <li>俱乐部ID: {{club.club_id}}</li>
                        <li>俱乐部名称: {{club.club_name}}</li>
                        <li>俱乐部剩余房卡: {{club.gems}}</li> 
                        <li>俱乐部历史总房卡: {{club.total_gems}}</li> 
                        <li>俱乐部人数上限: {{club.limit}} </li>
                        <li>俱乐部人数: {{club.current}}</li>
                        
                        <li v-if="club.audit_count==0">待审核申请: {{club.audit_count}}</li>
                        <li v-if="club.audit_count!=0">待审核申请: <span style="color:red;font-size:16px;">{{club.audit_count}}</span></li>
                        <!-- <li>俱乐部消耗房卡: {{order.name}}</li> -->
                        <!-- <li>俱乐部创建时间: {{club.crate_time}}</li> -->
                    </ul>
                    
                </div>
            </div>
        </div>
       </div>
    </div>
</template>

<script>
import $ from 'zepto'
import VNav from '../../components/Nav'
import _global from '../global'

export default {
  route: {
    data ({from, next}) {
      if (from.path === '/user') {
        
        this.path = from.path
      }
    }
  },
  ready () {
    // if (!window.localStorage.getItem('user_id')) {
    //   location.reload()
    //   this.$router.go('/')
    //   return
    // }
    if (window.localStorage.getItem('user_id')) {
      self.userId = parseInt(window.localStorage.getItem('user_id'), 0)
    }
    $.init()
    this.getClubList()
  },
  data () {
    return {
      path: '/home',
      title: '俱乐部管理',
      id: 0,
      clubList: [],
      predisabled: '',
      active: 'active',
      nextdisabled: '',
      userId: 0
    }
  },
  computed: {
    length () {
      return this.clubList.length
    }
  },
  methods: {
  
    //创建俱乐部
    createClub(){
      let self = this
      this.$router.go('/user/createClub');
      location.reload()
    },

    operateSelect(club_id, audit_count,userCount,club_name,club_gems){
        let self = this; 
          var buttons1 = [
              {
                text: '俱乐部管理',
                bold: true,
                label: true
             },
            {
                text: '俱乐部审核管理',
                bold: true,
                onClick: function() {
                self.auditList(club_id, audit_count);
               }
            },
             {
                text: '俱乐部成员管理',
                bold: true,
                onClick: function() {
                   self.getAllClubUser(club_id,userCount);
                 }
              }
              ,
             {
                text: '俱乐部房卡管理',
                bold: true,
                onClick: function() {
                   self.updateClub(club_id,club_name,club_gems);
                 }
              },{
                text: '俱乐部消耗管理',
                bold: true,
                onClick: function() {
                   self.getClubRoom(club_id);
                 }
              }
                    ];
            var buttons2 = [
                      {
                        text: '取消',
                        bg: 'danger'
                      }
                    ];
                    var groups = [buttons1, buttons2];
                    $.actions(groups); 

    },

    auditList (club_id, audit_count) {
      if(audit_count==0){
        $.alert('暂无需要审核申请');
        return
      }
     
      this.$router.go('/user/applyAudit/' + club_id)
       location.reload()
    },

    getAuditLog (club_id) {
     
      this.$router.go('/user/auditLog/' + club_id)
       location.reload()
    },

    updateClub (club_id,club_name,club_gems) {
     
      this.$router.go('/user/updateClub/' + club_id +'/'+club_gems+'/'+club_name)
       location.reload()
    },


    getAllClubUser (club_id, userCount) {
      if(userCount==0){
        $.alert('暂无俱乐部成员');
        return
    }
     
      this.$router.go('/user/getAllClubUser/' + club_id)
       location.reload()
    },
    getClubRoom (club_id) {
     
      this.$router.go('/user/getClubRoom/' + club_id)
       location.reload()
    },
    getClubList () {
      let self = this
      if (window.localStorage.getItem('user_id')) {
        self.userId = parseInt(window.localStorage.getItem('user_id'), 0)
        self.id = parseInt(window.localStorage.getItem('id'), 0)
        self.roleId = parseInt(window.localStorage.getItem('role_id'), 0)
      }
      // if (self.userId === 0) {
      //   return
      // }
      self.p_id = parseInt(this.$route.params.p_id, 0) || 1
      this.$http.get(_global.url + '/getClubList?id=' + self.id + '&role_id='+self.roleId).then(function(res) {
        if (typeof res.data === 'string') {
          res.data = JSON.parse(res.data)
        }
        if (res.data.errcode === -999) {
          // this.$router.go('/')
          window.location.href = _global.url + '/wxlogin'
          return
        }
        self.clubList = res.data.data
      
        console.log(self.clubList)
       
      }, function(res) {
        console.log(res)
      })
    },
    classActive (index) {
      if (index === this.p_id) {
        return 'active'
      }
      return ''
    }
  },
  create () {
    this.getClubList()
  },
  components: {
    VNav
  }
}
</script>

<style>
.tasks {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.tasks-tabs .buttons-tab {
  z-index: 10;
  margin-top:2.2rem;
}

.club {
  margin-top: 3.5rem;

}

club li {
list-style-type:none;
}

li {
list-style-type:none;
}
</style>
